<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <style>
        #header{color:red;}
        /* #header a{color:red;} */
        #header>a{color:red;}
        #header+p{color:purple;}
        #header~p{color:purple;}
        .star>span{
            color:red
            
        }
        .star>.cur~span{
            color:black; 
        }
        #tree>li>span{
            color:red;
        }
       .da{list-style: none;}
       .da li{list-style: none;}
       .da>a:link{color:red;text-decoration: none;}
       .da>a:visited{color:red}
        .da>ul{display: none;}
        .da a:hover+ul{display: block;}
        .da>a:active+ul{display: block;}
        p span.cur{
            color:red;
        }
        p .txt{
            color:green;
        }
    </style>
</head>
<body>
   
    <div id="header">
        <p>
            <b>文本</b>
            <a href="#">孙子辈</a>
             段落
        </p>
        <a href="#">链接</a>
        <a href="#">链接2</a>
    </div>
    <p>同辈</p>
    <p>同辈2</p>
    <hr>
    <p class="star">
        <span>★</span>
        <span>★</span>
        <span class="cur">★</span>
        <span>★</span>
        <span>★</span>

    </p>
    <hr>
    <ul id="tree" style="height: 100px;">
        <li class="da"><a href="#">首页</a>
            <ul>
                <li>幻灯</li>
                <li>关于</li>
            </ul>
        </li>
        <li class="da"><a href="#">用户</a>
            <ul>
                <li>瀛湖</li>
                <li>撒旦撒旦</li>
            </ul>
        </li>
    </ul>
  
    <hr>
    <p>
        <!-- p=1 class=10 id=100   权重值 -->
        <span class="txt">我只有11</span>📕<span class="txt cur">我也有11</span>
        
    </p>
    

</body>
</html>